<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>XMLHttpRequest</title>
</head>
<body>
<script>
/*    let xhr = new XMLHttpRequest();

    //   请求方式 : GET POST DELETE PUT
    //   请求地址 : URL
    //   异步/同步 :  true / false
    //  user 可选 可选的用户名用于认证用途；默认为null。
//      password 可选 可选的密码用于认证用途，默认为null。
//    xhr.open(method, url, async, user, password);
    xhr.open("GET", "./data/getData.txt", false);//false同步 true异步
//    console.log("send 前xhr.onreadystatechange--->",xhr.readyState, xhr.onreadystatechange);
    xhr.send();// readystate==> 0 , 1, 2, 3, 4

//    console.log("send 后xhr.onreadystatechange--->",xhr.readyState, xhr.onreadystatechange);
    xhr.onreadystatechange = function () {// 监听 回调
//        console.log("onreadystatechange====>",xhr)
    };

//    console.log("xhr.onreadystatechange--->",xhr.readyState ,xhr.onreadystatechange);
    //为什么JSON.stringify(xhr) 打印出来是个空对象
//    console.log(JSON.stringify(xhr))
//    console.log(xhr)*/



/*let xhr = new XMLHttpRequest();
xhr.open("GET", "./data/getData.txt", true);//false同步 true异步
xhr.onreadystatechange = function () {// 监听 回调
        console.log("onreadystatechange====>",xhr)
};
xhr.send();// readyState==> 0 , 1, 2, 3, 4
console.log(xhr)*/



//封装原生ajax

function myAjax(type, url, async, data, successCB, errCB) {
    if(type.toLowerCase() === "get"){
//        data = {name:"haha2", age: 11}
//        url = ./data/getData.txt
        //需求: 把url和data 转换成以下这种形式
//        trueUrl = ./data/getData.txt?name=haha2&age=11


        url += "?=" + data
    }


    let xhr = new XMLHttpRequest();
    xhr.open(type, url, async);//false同步 true异步
    xhr.onreadystatechange = function () {// 监听 回调
//       服务器返回的data

        if(xhr.readyState === 4 && xhr.status === 200){
            console.log("onreadystatechange====>",xhr,xhr.responseText);
            successCB(xhr.responseText)
        }
        if(xhr.readyState === 4 && xhr.status !== 200 ){
            errCB({
                status: xhr.status,
                errMsg: xhr.statusText
            })
        }
    };
    xhr.send(data);
}

//myAjax("POST", "./data/getData.txt", true, {name:"haha2"}, function(data){
//    console.log("成功后的回调", data)
//}, function (err) {
//    console.log("失败后的回调", err)
//})
myAjax("GET", "./data/getData.txt", true, {name:"haha2"}, function(data){
    console.log("成功后的回调", data)
}, function (err) {
    console.log("失败后的回调", err)
})



console.log(window)



</script>
</body>
</html>